<!DOCTYPE html>
<html>
<head>
	<title></title>
	<style type="text/css">
		body {
    background:url(https://source.unsplash.com/random/1600x900);
    background-repeat: no-repeat;
    background-attachment:fixed;
    background-position:50% 50%;
    background-size:cover;
}
	</style>
</head>
<body>
	
  <script>
    var countImg = 0;
  document.body.style.background = "url('.//1600x900')";
  document.body.style.backgroundRepeat = "no-repeat";
  document.body.style.backgroundAttachment = "fixed";
  document.body.style.backgroundPositionX = "50%";
  document.body.style.backgroundPositionY = "50%";
  // document.body.style.backgroundSize = "cover";
    var changeImg = self.setInterval("change()",1800000);
    function change(){
      count = count+1;
      document.body.style.background = "url('./blogbanner2.jpg')";
      document.body.style.backgroundRepeat = "no-repeat";
      document.body.style.backgroundAttachment = "fixed";
      document.body.style.backgroundPositionX = "50%";
      document.body.style.backgroundPositionY = "50%";
      // document.body.style.backgroundSize = "cover";
      if(countImg==100){
        window.clearInterval(changeImg);
      }
    }
  </script>
</body>
</html>